<template>
    <view v-if="isLogin">
        <u-number-box v-if="cartNum > 0" 
            v-model="cartNum"
            input-width="25"
            bg-color="#42b983"
            color="#fff"
            :min="0" 
            :max="stock" @change="changeCart"></u-number-box>
        <u-button class="btn-addcart" shape="circle" v-if="cartNum < 1" size="mini" @click.prevent="handleAddCart(itemWin)">加入购物车33</u-button>
    </view>
    <view v-else>
        <u-button class="btn-addcart" size="mini" shape="circle"  @click.prevent="handleAddCart(itemWin)">加入购物车3</u-button>
    </view>
</template>
<script>
export default {
    name: "GoodsNumbox",
    data () {
        return {
            cartNum: 0,
            stock: 0,
        };
    },
    created() {
        this.cartNum = this.itemWin.cart_num;
        this.stock = this.itemWin.specValueList[0].stock;
    },
    props: {
        // spec
        itemWin: {
            type: Object,
            default: () => {},
        },
    },
    methods: {
        handleAddCart() {
            this.cartNum = 1;
            this.$emit("addToCart",{"item_win":this.itemWin, "num": 1, "cart_change": 0});
        },
        changeCart(e) {
            this.cartNum = e.value;
            this.$emit("addToCart", {"item_win":this.itemWin, "num": e.value, "cart_change": 1});
        }
    }
}
</script>
<style lang="scss" scoped>
    .btn-addcart {
        background-color: #42b983;
        color: #fff;
    }
</style>